import React from 'react';
import { Row, Col, Icon, Button, Spin } from 'antd';
import { printScreenDown } from '@/pages/EntryManage/utils';
import styles from './index.less';
import useHireConfirm from './hooks/useHireConfirm';

const Paragraph = ({ children, style }) => {
    const marginStyle = {
        margin: '12px 0',
        ...style
    };
    return <div style={marginStyle}>{children}</div>;
};

const ConfirmPage = ({ setOfferEffectiveValue, setStatus, setCompanyName, location, isDetailPage = false }) => {
    const { query = {} } = location;
    const { employId } = query;
    // const [agree, setAgree] = React.useState(false);
    const { infoData, loadingData, handleAccept, handleReject, submitLoading } = useHireConfirm({
        setOfferEffectiveValue,
        setStatus,
        setCompanyName,
        employId,
        isDetailPage,
        agree: true
    });

    // 预览打印录用通知书
    // function doPrint3() {
    //     // 判断iframe是否存在，不存在则创建iframe
    //     let iframe = document.getElementById('print-iframe');
    //     if (!iframe) {
    //         const el = document.getElementById('printPage');
    //         iframe = document.createElement('IFRAME');
    //         let doc = null;
    //         iframe.setAttribute('id', 'print-iframe');
    //         iframe.setAttribute('style', 'position:absolute;width:0px;height:0px;left:-500px;top:-500px;');
    //         document.body.appendChild(iframe);
    //         doc = iframe.contentWindow.document;
    //         // 这里可以自定义样式
    //         // doc.write('<LINK rel="stylesheet" type="text/css" href="./pagePrint.css">');
    //         doc.write(`<div>${el.innerHTML}</div>`);
    //         doc.close();
    //         iframe.contentWindow.title = '录用通知书';
    //         iframe.contentWindow.focus();
    //     }
    //     iframe.contentWindow.print();
    //     if (navigator.userAgent.indexOf('MSIE') > 0) {
    //         document.body.removeChild(iframe);
    //     }
    // }

    const confirmPageContent = {
        boxShadow: '0 1px 6px 0 rgba(0, 0, 0, 0.06)',
        padding: '52px 0',
        backgroundColor: '#fff',
        margin: isDetailPage ? '32px 32px 32px' : '32px 32px 148px',
        borderRadius: '8px',
        fontWeight: 500,
        color: 'rgba(0, 0, 0, 0.85)',
        fontFamily: 'PingFangSC-Medium, PingFang SC',
        lineHeight: '22px',
        fontSize: '12px',
        wordBreak: 'break-all'
    };

    const pageContent = (
        <Row style={confirmPageContent} id="printPage">
            <Col span={14} offset={5}>
                <div dangerouslySetInnerHTML={{ __html: infoData?.templateContent }} />
                <Paragraph>
                    <a
                        onClick={() => {
                            // doPrint3();
                            printScreenDown(document.querySelector('#printPage'), '录用通知书');
                        }}
                    >
                        <Icon type="download" style={{ marginRight: '8px' }}></Icon>
                        下载录用通知书
                    </a>
                </Paragraph>
            </Col>
        </Row>
    );

    return (
        <Spin spinning={loadingData}>
            {isDetailPage && pageContent}
            {!isDetailPage && (
                <>
                    {pageContent}
                    <Row className={styles.footConfirm}>
                        <Col span={16} offset={4}>
                            {/* <Checkbox */}
                            {/*    checked={agree} */}
                            {/*    onChange={() => setAgree(!agree)} */}
                            {/*    style={{ marginRight: '16px' }} */}
                            {/* ></Checkbox> */}
                            {/* 确认接受录用并同意在入职前提供背调联系信息，接受背调 */}
                            <div className={styles.buttonWrap}>
                                <Button onClick={handleReject}>拒绝</Button>
                                <Button loading={submitLoading} type="primary" onClick={handleAccept}>
                                    接受
                                </Button>
                            </div>
                        </Col>
                    </Row>
                </>
            )}
        </Spin>
    );
};

export default ConfirmPage;
